<%@page import="java.text.SimpleDateFormat"%>
<%@page import="java.util.Date"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>企业现有车位</title>
<link rel="stylesheet" type="text/css" href="../../css/bootstrap.min.css"> 
<style type="text/css">
	#showTable1{
		width:900px;
		margin-top:20px;
		margin:0 auto;
	}
	#showPort1{
		margin:0 auto;
		width:1100px;
		height:200px;
		padding-top:30px;
	}
	#BtnDiv1{
		width:200px;
		margin-top:30px;
		margin-left:400px;
	}
	#bodyDiv1{
	margin-top:100px;
		padding-top:0px;
		width:600px;
	}
	#num1{
		width:60px;
	}
	#port_position{
		width:150px;
	}
	#portNumber{
		width:160px;
	}
	#rentNumber{
		width:160px;
	}
	td{
		text-align:center;
	}
</style>
</head>
<body>
	<div id="bodyDiv1">
	<input type="hidden" id="companyID" value="${sessionScope.myCompany.companyID }" >
		<div id="showPort1">
			<table id="showTable1" class="table table-bordered">
				<tr>
					<td id="num1">编号</td>
					<td id="port_position">位置</td>
					<td id="portNumber">车位号</td>
					<td id="rentNumber">合同编号</td>
					<td id="stratTime1">合同开始日期</td>
					<td id="endTime1">合同结束日期</td>
				</tr>
			</table>
		</div>
		<div id="BtnDiv1">
				<input type="button" id="UpBtn" onclick="pageUp()" class="btn btn-info" value="上一页" >
				<label id="lb1"></label>
				<label>/</label>
				<label  id="lb3"></label>
		<input type="button" id="DownBtn" onclick="pageDown()" class="btn btn-info" value="下一页" >
		</div>
	</div>
	<script type="text/javascript" src="../../js/jquery-3.1.0.min.js"></script>
	<script type="text/javascript">	
		var curPage=1;
		var maxPage=1;
		var countNum = 0;
		var pageSize = 0
		var startTime = 0;
		var endTime = 0;
		$(function(){
			sendPage();
		})
		function pageUp(){
			document.getElementById("DownBtn").disabled=false;
			curPage=curPage-1;
			if(curPage<1){
				curPage=1;
			}
			countNum=countNum-(3+pageSize);
			if(countNum<0){
				countNum=0;
			}
			$('#showTable1 tr:gt(0)').remove();
			sendPage();
		}
		function pageDown(){
			curPage=curPage+1;
			if(curPage>maxPage-1){
				curPage=maxPage
				document.getElementById("DownBtn").disabled=true;
			}
			$('#showTable1 tr:gt(0)').remove();
			sendPage();
		}
		function sendPage(){
			var str = "";
			$.ajax({
				   type: "POST",
				   url: "../../findAllCompanycarPort.do",
				   data: {"needPage":curPage,"compID":$("#companyID").val()},
				   success: function(msg){
					   console.info(msg);
					   maxPage=msg.countPage;
				   	   for(var i=0;i<msg.list.length;i++){
				   		 countNum = countNum+1;
				   		 startTime = msg.list[i][3];
				   		 endTime = msg.list[i][4];
				   		 $("#lb1").html(curPage);
				   		 $("#lb3").html(msg.countPage);
				   		 str += "<tr><td>"+countNum+"</td><td>"+msg.list[i][0]+"</td><td>"+msg.list[i][1]+"</td><td>"+msg.list[i][2]+"</td><td>"+new Date(msg.list[i][3]).toLocaleDateString()+"</td><td>"+new Date(msg.list[i][4]).toLocaleDateString()+"</td></tr>";
				   	   }
				   	   pageSize = msg.list.length;
				   	   $("#showTable1").append(str);
				   }
			});
		}
	</script>
</body>
</html>